﻿<phone:PhoneApplicationPage
    x:Class="TaiwanPP.WP8App.filter"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"
    xmlns:toolkitPrimitives="clr-namespace:Microsoft.Phone.Controls.Primitives;assembly=Microsoft.Phone.Controls.Toolkit"
    xmlns:maptk="clr-namespace:Microsoft.Phone.Maps.Toolkit;assembly=Microsoft.Phone.Controls.Toolkit"
    xmlns:maps="clr-namespace:Microsoft.Phone.Maps.Controls;assembly=Microsoft.Phone.Maps"
    xmlns:Helpers="clr-namespace:TaiwanPP.WP8App.Helpers"
    xmlns:libViewModels="clr-namespace:TaiwanPP.Library.ViewModels;assembly=TaiwanPP.Library"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="Black"
    SupportedOrientations="Portrait" Orientation="Portrait"
    mc:Ignorable="d"
    shell:SystemTray.IsVisible="True"
    shell:SystemTray.Opacity="0"
    shell:SystemTray.BackgroundColor="Transparent">
    <shell:SystemTray.ProgressIndicator>
        <shell:ProgressIndicator x:Name="systemtray"/>
    </shell:SystemTray.ProgressIndicator>
    <phone:PhoneApplicationPage.Resources>
        <Helpers:connectivitystringConverter x:Key="connectivitystringConverter"/>
        <Helpers:geoPointConverter x:Key="geoPointConverter"/>
        <Helpers:distanceswitchfilterConverter x:Key="distanceswitchfilterConverter"/>
        <Helpers:boolvisConverter x:Key="boolvisConverter"/>
        <Helpers:kilometertermConverter x:Key="kilometertermConverter"/>
        <Helpers:filterConverter x:Key="filterConverter"/>
        <Style x:Key="FixedToggleSwitchButtonStyle" TargetType="toolkitPrimitives:ToggleSwitchButton">
            <Setter Property="Foreground" Value="#000000"/>
            <Setter Property="Background" Value="#FFFFFF"/>
            <Setter Property="IsTabStop" Value="False"/>
            <Setter Property="SwitchForeground" Value="#000000"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="toolkitPrimitives:ToggleSwitchButton">
                        <Border x:Name="Root" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CacheMode="BitmapCache" Opacity="{TemplateBinding Opacity}" Padding="{TemplateBinding Padding}">
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Normal"/>
                                    <VisualState x:Name="Disabled">
                                        <Storyboard>
                                            <ColorAnimation Duration="0" To="{TemplateBinding Foreground}" Storyboard.TargetProperty="(Grid.Background).(SolidColorBrush.Color)" Storyboard.TargetName="SwitchBottom"/>
                                            <ColorAnimation Duration="0" To="{TemplateBinding Foreground}" Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)" Storyboard.TargetName="ThumbCenter"/>
                                            <DoubleAnimation Duration="0" To="0.3" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="Root"/>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="CheckStates">
                                    <VisualStateGroup.Transitions>
                                        <VisualTransition GeneratedDuration="0:0:0.03" To="Unchecked"/>
                                        <VisualTransition GeneratedDuration="0:0:0.03" To="Checked"/>
                                    </VisualStateGroup.Transitions>
                                    <VisualState x:Name="Checked">
                                        <Storyboard>
                                            <DoubleAnimation Duration="0" To="61" Storyboard.TargetProperty="(TranslateTransform.X)" Storyboard.TargetName="BackgroundTranslation">
                                                <DoubleAnimation.EasingFunction>
                                                    <ExponentialEase EasingMode="EaseOut" Exponent="15"/>
                                                </DoubleAnimation.EasingFunction>
                                            </DoubleAnimation>
                                            <DoubleAnimation Duration="0" To="61" Storyboard.TargetProperty="(TranslateTransform.X)" Storyboard.TargetName="ThumbTranslation">
                                                <DoubleAnimation.EasingFunction>
                                                    <ExponentialEase EasingMode="EaseOut" Exponent="15"/>
                                                </DoubleAnimation.EasingFunction>
                                            </DoubleAnimation>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Dragging"/>
                                    <VisualState x:Name="Unchecked">
                                        <Storyboard>
                                            <DoubleAnimation Duration="0" To="0" Storyboard.TargetProperty="(TranslateTransform.X)" Storyboard.TargetName="BackgroundTranslation"/>
                                            <DoubleAnimation Duration="0" To="0" Storyboard.TargetProperty="(TranslateTransform.X)" Storyboard.TargetName="ThumbTranslation"/>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Grid x:Name="SwitchRoot" Background="Transparent" Height="95" Width="136">
                                <Grid x:Name="SwitchTrack" Width="89">
                                    <Grid x:Name="SwitchBottom" Background="{TemplateBinding SwitchForeground}" Height="34">
                                        <Rectangle x:Name="SwitchBackground" Fill="#FFFFFF" HorizontalAlignment="Center" Height="26" VerticalAlignment="Center" Width="82" Margin="4,4,3,4">
                                            <Rectangle.RenderTransform>
                                                <TranslateTransform x:Name="BackgroundTranslation"/>
                                            </Rectangle.RenderTransform>
                                        </Rectangle>
                                        <Border BorderBrush="{TemplateBinding Foreground}" BorderThickness="1">
                                            <Border BorderBrush="{TemplateBinding Background}" BorderThickness="3"/>
                                        </Border>
                                    </Grid>
                                    <Border x:Name="SwitchThumb" BorderBrush="{TemplateBinding Background}" BorderThickness="4" HorizontalAlignment="Left" Height="38" Margin="0" Width="28" Background="White">
                                        <Border.RenderTransform>
                                            <TranslateTransform x:Name="ThumbTranslation"/>
                                        </Border.RenderTransform>
                                    </Border>
                                </Grid>
                            </Grid>
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <Style x:Key="FixedToggleSwitchStyle" TargetType="toolkit:ToggleSwitch">
            <Setter Property="Background" Value="{StaticResource PhoneBackgroundBrush}"/>
            <Setter Property="FontFamily" Value="{StaticResource PhoneFontFamilyLight}"/>
            <Setter Property="FontSize" Value="{StaticResource PhoneFontSizeLarge}"/>
            <Setter Property="Foreground" Value="{StaticResource PhoneForegroundBrush}"/>
            <Setter Property="IsTabStop" Value="False"/>
            <Setter Property="HorizontalContentAlignment" Value="Left"/>
            <Setter Property="SwitchForeground" Value="{StaticResource PhoneAccentBrush}"/>
            <Setter Property="VerticalContentAlignment" Value="Top"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="toolkit:ToggleSwitch">
                        <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CacheMode="BitmapCache" Padding="{TemplateBinding Padding}">
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Normal"/>
                                    <VisualState x:Name="Disabled">
                                        <Storyboard>
                                            <DoubleAnimation Duration="0" To="0.3" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="Header"/>
                                            <DoubleAnimation Duration="0" To="0.3" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="Content"/>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Grid Margin="12,5,12,42">
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="*"/>
                                    <ColumnDefinition Width="Auto"/>
                                </Grid.ColumnDefinitions>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="Auto"/>
                                    <RowDefinition Height="Auto"/>
                                </Grid.RowDefinitions>
                                <ContentControl x:Name="Header" ContentTemplate="{TemplateBinding HeaderTemplate}" Content="{TemplateBinding Header}" Foreground="{StaticResource PhoneSubtleBrush}" FontSize="{StaticResource PhoneFontSizeNormal}" FontFamily="{StaticResource PhoneFontFamilyNormal}" HorizontalAlignment="Left" IsTabStop="False" Margin="-1,0,0,0" Opacity="{TemplateBinding Opacity}" VerticalAlignment="Bottom"/>
                                <ContentControl x:Name="Content" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" IsTabStop="False" Margin="-1,1,0,-7" Opacity="{TemplateBinding Opacity}" Grid.Row="1" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                                <toolkitPrimitives:ToggleSwitchButton x:Name="Switch" Background="{TemplateBinding Background}" Grid.Column="1" Margin="-22,-29,-24,-28" Opacity="{TemplateBinding Opacity}" Grid.RowSpan="2" SwitchForeground="{TemplateBinding SwitchForeground}" VerticalAlignment="Bottom" Style="{StaticResource FixedToggleSwitchButtonStyle}" Foreground="{TemplateBinding Foreground}"/>
                            </Grid>
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </phone:PhoneApplicationPage.Resources>

    <!--LayoutRoot 是放置所有頁面的根資料格-->
    <Grid x:Name="LayoutRoot" Background="#FFF7F7F7" Margin="0,32,0,0" Loaded="App_Loaded">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <Grid.DataContext>
            <libViewModels:stationViewModel/>
        </Grid.DataContext>

        <!--TitlePanel 包含應用程式的名稱和頁面標題-->
        <StackPanel Grid.Row="0" Margin="12,5,0,28">
            <TextBlock Text="加油站過濾設定" Style="{StaticResource PhoneTextNormalStyle}" Foreground="Black" FontSize="45"/>
 
        </StackPanel>

        <!--ContentPanel - 其他內容置於此-->
        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,-30,12,0">
            <ScrollViewer>
            <StackPanel>
                <Border BorderThickness="0,0,0,1" BorderBrush="Black" Margin="0,3">
                    <TextBlock Text="搜尋範圍" FontSize="26"/>
                </Border>
                <toolkit:ToggleSwitch Foreground="Black" Content="{Binding DataContext.sfiltercountryEnable, Converter={StaticResource distanceswitchfilterConverter}, ElementName=LayoutRoot}" Style="{StaticResource FixedToggleSwitchStyle}" IsChecked="{Binding DataContext.sfiltercountryEnable, ElementName=LayoutRoot, Mode=TwoWay}">
                    <toolkit:ToggleSwitch.Header>
                        <TextBlock Text="搜尋方式" Foreground="Black"/>
                    </toolkit:ToggleSwitch.Header>
                </toolkit:ToggleSwitch>
                    <StackPanel Visibility="{Binding DataContext.sfiltercountryEnable, ConverterParameter=0, Converter={StaticResource boolvisConverter}, ElementName=LayoutRoot}">
                        <toolkit:ToggleSwitch Foreground="Black" Content="{Binding DataContext.sfiltercustomLocation, Converter={StaticResource filterConverter}, ElementName=LayoutRoot}" Style="{StaticResource FixedToggleSwitchStyle}" IsChecked="{Binding DataContext.sfiltercustomLocation, ElementName=LayoutRoot, Mode=TwoWay}">
                            <toolkit:ToggleSwitch.Header>
                                <TextBlock Text="自訂地點" Foreground="Black"/>
                            </toolkit:ToggleSwitch.Header>
                        </toolkit:ToggleSwitch>
                        <StackPanel Visibility="{Binding DataContext.sfiltercustomLocation, ConverterParameter=1, Converter={StaticResource boolvisConverter}, ElementName=LayoutRoot}">
                            <TextBlock Text="輸入地址以搜尋地點" Margin="12,0,0,0"/>
                            <StackPanel Orientation="Horizontal">
                                <TextBox x:Name="customlocation" BorderBrush="#BF000000" Width="311" />
                                <Button Content="搜尋位置" BorderBrush="Black" Foreground="Black" Click="queryCustom_Click"/>
                            </StackPanel>
                            <TextBlock Text="{Binding DataContext.sfilterlocationname, ElementName=LayoutRoot}"/>
                            <maps:Map Name="mapcontrol" ZoomLevel="15"  HorizontalAlignment="Stretch" VerticalAlignment="Stretch" LandmarksEnabled="False" Height="150" Center="{Binding DataContext.centerloc, Converter={StaticResource geoPointConverter}, ElementName=LayoutRoot, Mode=TwoWay}" Visibility="{Binding DataContext.sfilterlocated, ConverterParameter=1, Converter={StaticResource boolvisConverter}, ElementName=LayoutRoot}" Loaded="mapcontrol_Loaded">
                                <maptk:MapExtensions.Children>
                                    <maptk:MapItemsControl>
                                        <maptk:Pushpin GeoCoordinate="{Binding DataContext.sfilterlocation, Converter={StaticResource geoPointConverter}, ElementName=LayoutRoot}">
                                            <maptk:Pushpin.Template>
                                                <ControlTemplate>
                                                    <Grid>
                                                        <Grid Height="15.999" Width="16" Visibility="{Binding current, ConverterParameter=1, Converter={StaticResource boolvisConverter}}">
                                                            <Path Data="F1M16,8C16,12.417 12.419,15.999 8,15.999 3.581,15.999 0,12.417 0,8 0,3.583 3.581,0 8,0 12.419,0 16,3.583 16,8" Fill="#FFFF9999"/>
                                                            <Path Data="F1M9.999,5C9.999,7.761 7.761,10 4.999,10 2.238,10 0,7.761 0,5 0,2.238 2.238,0 4.999,0 7.761,0 9.999,2.238 9.999,5" Fill="#FFBF0000" Margin="3,2.999,3.001,3"/>
                                                        </Grid>
                                                    </Grid>
                                                </ControlTemplate>
                                            </maptk:Pushpin.Template>
                                        </maptk:Pushpin>
                                    </maptk:MapItemsControl>
                                </maptk:MapExtensions.Children>
                            </maps:Map>
                        </StackPanel>
                        <TextBlock Text="{Binding Value, Converter={StaticResource kilometertermConverter}, ElementName=rating}" Margin="12,0,0,0" FontFamily="Portable User Interface" Foreground="Black"/>
                <toolkit:Rating x:Name="rating" Value="{Binding DataContext.sfilterKilonmeter,  ElementName=LayoutRoot, Mode=TwoWay}" RatingItemCount="15" Background="{x:Null}" Width="412" BorderThickness="0,10" Height="55" FontFamily="Portable User Interface">
                    <toolkit:Rating.FilledItemStyle>
                        <Style TargetType="toolkit:RatingItem">
                            <Setter Property="Template">
                                <Setter.Value>
                                    <ControlTemplate>
                                        <Rectangle Fill="Black" Stroke="Black" Margin="1,1,1,1" Width="22" Height="47" StrokeThickness="0"/>
                                    </ControlTemplate>
                                </Setter.Value>
                            </Setter>
                        </Style>
                    </toolkit:Rating.FilledItemStyle>
                    <toolkit:Rating.UnfilledItemStyle>
                        <Style TargetType="toolkit:RatingItem">
                            <Setter Property="Template">
                                <Setter.Value>
                                    <ControlTemplate>
                                        <Rectangle Stroke="Black" Margin="1,1,1,1" Width="22" Height="22" StrokeThickness="3"/>
                                    </ControlTemplate>
                                </Setter.Value>
                            </Setter>
                        </Style>
                    </toolkit:Rating.UnfilledItemStyle>
                </toolkit:Rating>
                    </StackPanel>
                    <StackPanel Visibility="{Binding DataContext.sfiltercountryEnable, ConverterParameter=1, Converter={StaticResource boolvisConverter}, ElementName=LayoutRoot}">
                    <TextBlock Text="搜尋縣市範圍" Foreground="Black" Margin="0,5,0,0"/>
                        <toolkit:ListPicker x:Name="countrySelector" BorderBrush="Black" ItemsSource="{Binding DataContext.countryitems, ElementName=LayoutRoot}" Foreground="Black" FontFamily="Portable User Interface" SelectionChanged="countrySelector_SelectionChanged" >
                            <toolkit:ListPicker.FullModeItemTemplate>
                                <DataTemplate>
                                    <TextBlock Text="{Binding}" FontSize="35" FontFamily="Portable User Interface" Margin="0,7"/>
                                </DataTemplate>
                            </toolkit:ListPicker.FullModeItemTemplate>
                        </toolkit:ListPicker>
                    </StackPanel>
                    <Border BorderThickness="0,0,0,1" BorderBrush="Black" Margin="0,3">
                    <TextBlock Text="過濾選項(6)" FontSize="26"/>
                </Border>
                    <toolkit:ToggleSwitch Foreground="Black" Content="{Binding DataContext.sfilterInservice, Converter={StaticResource filterConverter}, ElementName=LayoutRoot}" Style="{StaticResource FixedToggleSwitchStyle}" IsChecked="{Binding DataContext.sfilterInservice, ElementName=LayoutRoot, Mode=TwoWay}">
                        <toolkit:ToggleSwitch.Header>
                            <TextBlock Text="僅顯示營業中的加油站" Foreground="Black"/>
                        </toolkit:ToggleSwitch.Header>
                    </toolkit:ToggleSwitch>
                    <TextBlock Text="營業時間資料來自於台塑與中油網站，若與實際不符，請以實際為準" Foreground="DarkGray" TextWrapping="Wrap"/>
                    <toolkit:ToggleSwitch Foreground="Black" Content="{Binding DataContext.sfilterFPCC, Converter={StaticResource filterConverter}, ElementName=LayoutRoot}" Style="{StaticResource FixedToggleSwitchStyle}" IsChecked="{Binding DataContext.sfilterFPCC, ElementName=LayoutRoot, Mode=TwoWay}">
                    <toolkit:ToggleSwitch.Header>
                        <TextBlock Text="僅顯示中油加油站" Foreground="Black"/>
                    </toolkit:ToggleSwitch.Header>
                </toolkit:ToggleSwitch>
                <toolkit:ToggleSwitch Foreground="Black" Content="{Binding DataContext.sfilterCPC, Converter={StaticResource filterConverter}, ElementName=LayoutRoot}" Style="{StaticResource FixedToggleSwitchStyle}" IsChecked="{Binding DataContext.sfilterCPC, ElementName=LayoutRoot, Mode=TwoWay}">
                    <toolkit:ToggleSwitch.Header>
                        <TextBlock Text="僅顯示台塑加油站" Foreground="Black"/>
                    </toolkit:ToggleSwitch.Header>
                </toolkit:ToggleSwitch>
                <toolkit:ToggleSwitch Foreground="Black" Content="{Binding DataContext.sfilterDirect, Converter={StaticResource filterConverter}, ElementName=LayoutRoot}" Style="{StaticResource FixedToggleSwitchStyle}" IsChecked="{Binding DataContext.sfilterDirect, ElementName=LayoutRoot, Mode=TwoWay}">
                    <toolkit:ToggleSwitch.Header>
                        <TextBlock Text="僅顯示直營站" Foreground="Black"/>
                    </toolkit:ToggleSwitch.Header>
                </toolkit:ToggleSwitch>
                <TextBlock TextWrapping="Wrap" Text="請注意：台塑加油站沒有直營站，同時開啟這兩項會搜尋不到任何結果" Foreground="#FFE20000" HorizontalAlignment="Left" VerticalAlignment="Center" Visibility="{Binding DataContext.sfilterCPC, ConverterParameter=1, Converter={StaticResource boolvisConverter}, ElementName=LayoutRoot}" FontFamily="Portable User Interface"/>
                <toolkit:ToggleSwitch x:Name="sfilterSelf" Foreground="Black" Content="{Binding DataContext.sfilterSelf, Converter={StaticResource filterConverter}, ElementName=LayoutRoot}" Style="{StaticResource FixedToggleSwitchStyle}" IsChecked="{Binding DataContext.sfilterSelf, ElementName=LayoutRoot, Mode=TwoWay}">
                    <toolkit:ToggleSwitch.Header>
                        <TextBlock Text="僅顯示自助加油站" Foreground="Black"/>
                    </toolkit:ToggleSwitch.Header>
                </toolkit:ToggleSwitch>
                <toolkit:ToggleSwitch Foreground="Black" Content="{Binding DataContext.sfilterFavoirte, Converter={StaticResource filterConverter}, ElementName=LayoutRoot}" Style="{StaticResource FixedToggleSwitchStyle}" IsChecked="{Binding DataContext.sfilterFavoirte, ElementName=LayoutRoot, Mode=TwoWay}">
                    <toolkit:ToggleSwitch.Header>
                        <TextBlock Text="儲存的加油站置於另外群組" Foreground="Black"/>
                    </toolkit:ToggleSwitch.Header>
                </toolkit:ToggleSwitch>
            </StackPanel>
            </ScrollViewer>
        </Grid>
        <StackPanel HorizontalAlignment="Left" Height="32" Margin="0,-32,0,0" VerticalAlignment="Top" Width="480" Background="{StaticResource PhoneAccentBrush}" Orientation="Horizontal" x:Name="titlebar">
            <StackPanel.DataContext>
                <libViewModels:infoViewModel/>
            </StackPanel.DataContext>
            <TextBlock x:Name="title" HorizontalAlignment="Left" Margin="10,0,0,0" TextWrapping="Wrap" Text="台灣油價查詢" VerticalAlignment="Top" Width="132" Foreground="White"/>
            <TextBlock Foreground="White" Text="{Binding DataContext.connectivity, Converter={StaticResource connectivitystringConverter}, ElementName=titlebar}"/>
        </StackPanel>
    </Grid>

</phone:PhoneApplicationPage>